<template>
  <div>
    <Row class="main" type="flex" justify="center" :gutter="16">
      <Col span="16">
        <Card class="shadow">
          <Row>
            <Col span="8" class="v-split" style="text-align: center;">
              <img class="cover" src="../assets/logo.png" alt="">
            </Col>
            <Col span="16">
              <div style="padding: 1rem;">
                <h1>线性导论</h1>
                <p style="margin-top: 1rem">
                  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate deserunt dolore dolorem eaque eum, ex illum minima, minus molestias necessitatibus non odio pariatur quaerat, rerum soluta. Aspernatur cumque magni perferendis!
                </p>
              </div>
            </Col>
          </Row>
        </Card>
      </Col>
      <Col span="4">
        <Card class="shadow">
          <p slot="title">资源</p>
          <div>
            <p style="padding: .5rem 0; border-bottom: 1px solid #e9eaec ">aasas</p>
          </div>
        </Card>
      </Col>
    </Row>
    <Row type="">

    </Row>
  </div>
</template>

<script>
export default {
  name: 'LessonDetail'
}
</script>

<style scoped>
.main {
  margin-top: 1rem;
}

.cover {
  display: block;
  height: 300px;
  margin: 0 auto;
}

.v-split {
  border-right: 1px solid #e9eaec;
}

.shadow {
  box-shadow: 0 1px 6px rgba(0,0,0,.2);
}
</style>
